<template>
	<view class="content">
		<f-navbar :title="statustitle" fontColor="#333" fontSize="34" bgColor="#fff">
			<view class="u-flex" slot="left">
				<van-icon name="arrow-left" color="#333" size="20" />
			</view>
		</f-navbar>
		<view class="content_box">

			<view class="content_top">
				<view class="content_topL">
					<view class="content_topname">
						<!-- <view class="mapicon"></view> -->
						<image class="mapicon" :src="imgurl+'dizhiicon.png'" mode=""></image>
						<view class="content_name">{{dataobj.receive_name}}</view>
						<view class="content_topphone">{{dataobj.receive_phone}}</view>
					</view>
					<view class="content_topaddress">{{dataobj.receive_full_address}}</view>
				</view>
				<!-- <van-icon class="right_icon" name="arrow" size="20" color="#999"/> -->
				
			</view>
			<view class="kuaidibox" v-if="dataobj.status==3" >
				<view class="kuaidibox_img1">
					<image class="kuaidibox_img" :src="imgurl+'kuaidi_icon.png'" mode=""></image>
					<view class="kuaidibox_txt">{{dataobj.express_company}} {{dataobj.express_number}}</view>
				</view>
				
				<!-- <van-icon class="right_icon" name="arrow" size="20" color="#999"/> -->
			</view>
			<view class="shops_box">
				<view class="shops_boxtop">
					<view class="shops_boxtopL">
						<!-- <view class="shops_boxtopLimg"> -->
							<image class="shops_boxtopLimg" :src="imgurl+'shop_icon.png'" mode=""></image>
						<!-- </view> -->
						<view class="shops_boxtopLname">{{dataobj.store_name}}</view>
						<van-icon name="arrow" size="12" color="#999"/>
					</view>
					<view class="shops_boxtopR">{{statustitle}}</view>
				</view>
				<view class="content_shopbox" v-for="(item,index) in dataobj.item" :key="index">
					<view class="content_shopimg">
						<image class="content_shopimg1" :src="item.good_item_img" mode=""></image>
					</view>
					<view class="content_shopR">
						<view class="content_shopRtxt">
							<view class="content_shopRtxtL">
								{{item.title}}</view>
							<view class="content_shopRtxtprice">￥{{item.tree_price}}</view>
						</view>
						<view class="content_shopguige">
							<view class="content_shopguigeL">{{item.spec_title}}</view>
							<view class="content_shopguigenum">*{{item.buy_num}}</view>
						</view>
					<!-- 	<view class="content_heji">合计：<text class="priceicon">￥</text><text
								class="price">31.60</text></view> -->
					</view>
				</view>
<!-- 				<view class="content_shopbox">
					<view class="content_shopimg"></view>
					<view class="content_shopR">
						<view class="content_shopRtxt">
							<view class="content_shopRtxtL">
								2022年时尚百搭卫衣优惠促销春节2022年时尚百搭卫衣2022年时尚百搭卫衣2022年时尚百搭卫衣.. </view>
							<view class="content_shopRtxtprice">￥15.80</view>
						</view>
						<view class="content_shopguige">
							<view class="content_shopguigeL">M码/165cm</view>
							<view class="content_shopguigenum">*2</view>
						</view>
						<view class="content_heji">合计：<text class="priceicon">￥</text><text
								class="price">31.60</text></view>
					</view>
				</view> -->
			</view>
			<view class="infobox">
				<view class="info_bianhao">
					<view class="info_bianhaoname">
						订单编号
					</view>
					<view class="info_bianhaoR">
						{{dataobj.order_no}}
						<text class="fuzhi" @click="onfuzhi">
							复制
						</text>
					</view>
				</view>
				<view class="info_bianhao">
					<view class="info_bianhaoname">
						下单时间
					</view>
					<view class="info_bianhaoR">
						{{dataobj.create_at}}
					
					</view>
				</view>
				<view class="info_bianhao">
					<view class="info_bianhaoname">
						支付方式
					</view>
					<view class="info_bianhaoR">
						微信支付
					
					</view>
				</view>
				<view class="info_bianhao">
					<view class="info_bianhaoname">
						商品总额
					</view>
					<view class="info_bianhaoR">
						￥{{dataobj.total_amount}}
				
					</view>
				</view>
				<view class="info_bianhao">
					<view class="info_bianhaoname">
						使用余额
					</view>
					<view class="info_bianhaoR">
						-￥{{dataobj.balance_amount}}
						<!-- <van-icon name="arrow" size="15" color="#999" /> -->
					</view>
				</view>
				<view class="info_bianhao">
					<view class="info_bianhaoname">
						运费
					</view>
					<view class="info_bianhaoR">
						<!-- ￥{{dataobj.express_amount}}（已包邮） -->
						￥{{dataobj.express_amount}} <text v-if="dataobj.express_amount=='0.00'">（已包邮）</text>
				
					</view>
				</view>
				<view class="fukuanbox">
					<view class="fukuanmoney">已付款: <text class="fukuanicon">￥</text><text class="fukuan_price">{{dataobj.total_free}}</text></view>
				</view>
			</view>
	<!-- 		<view class="payment_btnbox">
				<view class="payment_cancell">
					取消订单
				</view>
				<view class="payment_zhifu">
					立即付款
				</view>
			</view> -->
			<view class="info_bottomone"></view>
			<view class="info_bottom"  v-if="dataobj.status==2">
			<!-- 	<view class="shouhoubtn">
					申请售后
				</view> -->
				<view class="shouhuobtn" @click="onkuaidi">
					确认发货
				</view>
			</view>
		</view>
		
		<!-- 可用余额弹窗 -->
		<van-popup :show="isshowpopup"  closeable round :close-on-click-overlay="true" position="bottom" @close="onClosepopup">
			<view class="balance_box">
				<view class="balance_item">
					<view class="balance_itemL">
						可用余额
					</view>
					<view class="balance_itemR">
						￥15.6
						<van-checkbox class="duihaoicon" :value="ischecked" checked-color="#ff0000" @change="onChange"></van-checkbox>
					</view>
				</view>
			</view>
		</van-popup>
		<!-- 快递弹窗 -->
		<van-popup :show="iskuaidi"  closeable round :close-on-click-overlay="true" position="bottom" @close="onClosekuaidi">
		<view class="kuaidi_box">
			<view class="kuaidi_item">
				<view class="kuaidi_itemL">
					姓名
				</view>
				<view class="kuaidi_itemR">
					{{dataobj.receive_name}}
				</view>
			</view>
			<view class="kuaidi_line"></view>
			<view class="kuaidi_item">
				<view class="kuaidi_itemL">
					手机号
				</view>
				<view class="kuaidi_itemR">
					{{dataobj.receive_phone}}
				</view>
			</view>
			<view class="kuaidi_line"></view>
			<view class="kuaidi_item1">
				<view class="kuaidi_itemL1">
					地址
				</view>
				<view class="kuaidi_itemR">
					{{dataobj.receive_full_address}}
				</view>
			</view>
			<view class="kuaidi_line"></view>
			<view class="kuaidi_item">
				<view class="kuaidi_itemL">
					快递名称
				</view>
				<input class="we_ui" :value="expressname" @input="onexpressname" type="text" placeholder="请输入所发快递名称" placeholder-class="placlass">
			</view>
			<view class="kuaidi_line"></view>
			<view class="kuaidi_item">
				<view class="kuaidi_itemL">
					快递单号
				</view>
				<input class="we_ui" :value="expressnum" @input="ononexpressnum" type="text" placeholder="请输入快递单号" placeholder-class="placlass">
			</view>
			<view class="kuaidi_line"></view>
			<view class="uploadkuaidi_box">
				<view class="uploadkuaidi" @click="onuploadimg">
					<image class="cameraicon" :src="imgurl+'zhaoxiangjiicon.png'" mode=""></image>
					上传单号
				</view>
				<view class="uploadkuaidi1" v-if="expressimg!==''">
					<image class="upload_close" @click="deleteexpressimg" :src="imgurl+'upload_close.png.png'" mode=""></image>
					<image class="express_img" :src="expressimg" mode=""></image>
				</view>
			</view>
			<view class="bottomsubmit" @click="onfahuo">
				确认发货
			</view>
		</view>
		</van-popup>
		
	</view>
</template>

<script>
	import fNavbar from '@/uni_modules/f-navbar/components/f-navbar/f-navbar.vue';
	import {getStoreOrderDetail,sendGood} from '../../../utils/storeapp.js'
	export default {
		components: {
			fNavbar
		},
		data() {
			return {
				active: '1',
				navHeight: 0, //导航栏的高度
				isshowOrder: true,
				imgurl: getApp().globalData.imgurl,
				apiUrl: getApp().globalData.apiUrl,
				isshowpopup:false, // 可用余额弹窗
				ischecked:false, //是否使用可用金额
				iskuaidi: false, //打开快递弹窗
				orderNo:'', // 订单号
				dataobj:{}, // 数据
				expressname:'', // 快递名称
				expressnum:'', //快递单号
				expressimg:'', // 快递单图片
				statustitle:'', // 顶部导航栏状态
			}
		},
		onLoad(options) {
			console.log(options.orderNo);
			this.orderNo = options.orderNo
			this.getList()
		},
		methods:{
			// 获取数据
			getList(){
				getStoreOrderDetail({
					order_no: this.orderNo
				}).then(res => {
					console.log(res);
					if(res.code==1){
						this.dataobj = res.data
						if (res.data.status == 2) {
							this.statustitle = '待发货'
						} else if (res.data.status == 3) {
							this.statustitle = '待收货'
						} else if (res.data.status == 4) {
							this.statustitle = '已完成'
						}
					}else{
						uni.showToast({
							title: res.info,
							icon:'none',
							duration:2000
						})
					}

				
				})
			},
			// 确认发货
			onfahuo(){
				sendGood({
					order_no: this.orderNo,
					express_name: this.expressname,
					express_number: this.expressnum,
					express_img: this.expressimg
				}).then(res => {
					console.log(res);
					// this.dataobj = res.data
					if(res.code==1){
						this.iskuaidi = false
						this.getList()
					} else {
						uni.showToast({
							title: res.info,
							icon:'none',
							duration:2000
						})
					}
				
				})
			},
			// 输入快递名称
			onexpressname(e){
				console.log(e);
				this.expressname = e.detail.value
			},
			//输入快递单号
			ononexpressnum(e){
				this.expressnum = e.detail.value
			},
			// 点击复制
			onfuzhi() {
				uni.setClipboardData({
					data: this.dataobj.trade_no,
					success(res) {
			
					}
				})
			},
			// 关闭快递按钮
			onClosekuaidi(){
				this.iskuaidi = false
			},

			
			// 打开快递弹窗
			onkuaidi(){
				this.iskuaidi = true
			},
			
			// 是否使用可用金额
			onChange(e){
				console.log(e);
				this.ischecked = e.detail
			},
			// 打开可用余额弹窗
			onbalance(){
				this.isshowpopup = true
			},
			// 关闭可用余额弹窗
			onClosepopup(){
				this.isshowpopup = false
			},
			// 删除快递单号图片
			deleteexpressimg(){
				this.expressimg = ''
			},
			// 上传快递单号图片
			onuploadimg() {
				uni.chooseImage({
					sourceType: ['camera', 'album'], //从相册选择
					success: chooseImageRes => {
						console.log('成功', chooseImageRes);
						const tempFilePaths = chooseImageRes.tempFilePaths[0];
						console.log(tempFilePaths);
						// this.avatarimg = tempFilePaths
						uni.uploadFile({
							url: this.apiUrl+'api/uploadFile', //仅为示例，非真实的接口地址
							filePath: tempFilePaths,
							name: 'file',
							formData: {
								file: tempFilePaths,
								type: '1'
							},
							success: res => {
								console.log(res);
								let data1 = JSON.parse(res.data)
								console.log(data1);
								if (data1.code == 1) {
									this.expressimg = data1.data.url
				
								}
								// console.log('上传成功', JSON.parse(res.data));
								// uploadFile上传成功后，根据和后台的约定msgCode判断接口调用状态
				
							}
						});
					},
					// fail: err => {
					// 	this.myToast('图片上传失败', 'none');
					// }
				});
			
			},
			
			
		}
		}
</script>

<style>
	page{
		background: #eee;
	}
	
	/* 待支付页面样式 */
	
	/* 待支付页面样式 */
	.payment_box{
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.payment_time{
		font-size: 32rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #FF0000;
		line-height: 70rpx;
		margin-top: 25rpx;
	}
	.time_icon{
		margin-right: 10rpx;
	}
	.payment_title{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #333333;
		margin-top: 35rpx;
		/* line-height: 70rpx; */
	}
	.payment_submit{
		width: 154rpx;
		height: 60rpx;
		background: #FF0000;
		border-radius: 30rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 60rpx;
		text-align: center;
		margin-top: 40rpx;
		margin-bottom: 20rpx;
	}
	
	.content_top{
		width: 690rpx;
		height: 215rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 16rpx;
		display: flex;
		align-items: center;
		position: relative;
	}
	.content_topL{
		margin-left: 61rpx;
	}
	.content_topname{
		display: flex;
		align-items: center;
		position: relative;
	}
	.content_name{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #333333;
		margin-left: 20rpx;

	}
	.content_topphone{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #333333;
		margin-left: 29rpx;
	}
	.content_topaddress{
		width: 570rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		margin-top: 26rpx;
	}
	.right_icon{
		margin-right: 26rpx;
	}
	.mapicon{
		width: 21rpx;
		height: 30rpx;
		/* background: #000; */
		margin-left: -40rpx;
		/* margin-right: 20rpx; */
	/* 	position: absolute;
		top: 37rpx;
		left: 20rpx; */
	}
	.kuaidibox{
		width: 690rpx;
		height: 100rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 20rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.kuaidibox_img{
		width: 32rpx;
		height: 25rpx;
		/* background: #000; */
		margin-right: 20rpx;
		margin-left: 21rpx;
	}
	.kuaidibox_img1{
		display: flex;
		align-items: center;
	}
	.kuaidibox_txt{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		
	}
	.shops_box{
		width: 690rpx;
		/* height: 529rpx; */
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 20rpx;
		padding-bottom: 40rpx;
	}
	.shops_boxtop{
		padding-top: 39rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		
	}
	.shops_boxtopL{
		display: flex;
		align-items: center;
		margin-left: 20rpx;
	}
	.shops_boxtopLimg{
		width: 32rpx;
		height: 30rpx;
		/* background: #000; */
		margin-right: 10rpx;
	}
	.shops_boxtopLname{
		font-size: 30rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #333333;
		margin-right: 10rpx;
		/* line-height: 55rpx; */
	}
	.shops_boxtopR{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #00A0E9;
		margin-right: 20rpx;
		/* line-height: 2rpx; */
	}
	.content_shopbox {
		display: flex;
		align-items: center;
		margin-top: 30rpx;
		margin-left: 20rpx;
		padding-bottom: 20rpx;
		border-bottom: 1rpx solid #eee;
	}
	.content_shopbox:last-child{
		border-bottom: none;
	}
	
	.content_shopimg {
		width: 180rpx;
		height: 180rpx;
		/* background: #FF0000; */
		border-radius: 10rpx;
	}
	.content_shopimg1{
		width: 100%;
		height: 100%;
	}
	
	.content_shopR {
		margin-left: 20rpx;
		width: 66%;
	}
	
	.content_shopRtxt {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	
	.content_shopRtxtL {
		width: 313rpx;
		height: 80rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 42rpx;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}
	
	.content_shopRtxtprice {
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 500;
		color: #333333;
		line-height: 40rpx;
	}
	
	.content_shopguige {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 29rpx;
	}
	
	.content_shopguigeL {
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #999999;
	}
	
	.content_shopguigenum {
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #999999;
	}
	
	.content_heji {
		display: flex;
		align-items: center;
		justify-content: flex-end;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		margin-top: 29rpx;
		/* line-height: 40rpx; */
	}
	
	.priceicon {
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #FF0000;
		/* line-height: 40rpx; */
	}
	
	.price {
		font-size: 30rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #FF0000;
		/* line-height: 40rpx; */
	}
	.infobox{
		width: 690rpx;
		height: 528rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 20rpx;
	}
	.info_bianhao{
		height: 66rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		line-height: 66rpx;
	}
	.info_bianhao:first-child{
		padding-top: 18rpx;
	}
	.info_bianhaoname{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 500;
		color: #333333;
		margin-left: 20rpx;
	}
	.info_bianhaoR{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #999999;
		margin-right: 22rpx;
	}
	.fuzhi{
		/* display: inline-block; */
		font-size: 22rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #555555;
		padding: 3rpx 9rpx;
		background: #D2D2D2;
		border-radius: 13rpx;
		margin-left: 20rpx;
	}
	.fukuanbox{
		height: 98rpx;
		border-top: 1rpx solid #eee;
		margin: 0 20rpx;
		margin-top: 20rpx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: flex-end;
	}
	.fukuanmoney{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #555555;
	}
	.fukuanicon{
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #FF0000;
	}
	.fukuan_price{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #FF0000;
	}
	
	/* 底部支付按钮样式 */
	.payment_btnbox{
		display: flex;
		align-items: center;
		justify-content: flex-end;
		margin-right: 31rpx;
		margin-top: 40rpx;
	}
	.payment_cancell{
		width: 156rpx;
		height: 62rpx;
		border: 2rpx solid #BBBBBB;
		border-radius: 30rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #BBBBBB;
		line-height: 62rpx;
		box-sizing: border-box;
		text-align: center;
	}
	.payment_zhifu{
		width: 154rpx;
		height: 60rpx;
		background: #FF0000;
		border-radius: 30rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 60rpx;
		text-align: center;
		margin-left: 40rpx;
	}
	
	.info_bottomone{
		width: 100%;
		height: 108rpx;
	}
	.info_bottom{
		width: 100%;
		height: 98rpx;
		background: #FFFEFE;
		margin-top: 20rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		bottom: 0;
	}
	.shouhoubtn{
		width: 156rpx;
		height: 62rpx;
		border: 2rpx solid #BBBBBB;
		border-radius: 30rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #BBBBBB;
		line-height: 62rpx;
		box-sizing: border-box;
		text-align: center;
	}
	.shouhuobtn{
		width: 154rpx;
		height: 60rpx;
		background: #EF0E6C;
		border-radius: 30rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 60rpx;
		text-align: center;
		margin-right: 31rpx;
		margin-left: 39rpx;
	}
	
	
	.balance_box{
		width: 100%;
		min-height: 206rpx;
	}
	.balance_item{
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 100rpx;
	}
	.balance_itemL{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 40rpx;
		margin-left: 30rpx;
	}
	.balance_itemR{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FF0000;
		/* line-height: 40rpx; */
		margin-right: 34rpx;
		display: flex;
		align-items: center;
	}
	.duihaoicon{
	/* 	width: 32rpx;
		height: 32rpx; */
		margin-left: 22rpx;
	}
	.kuaidi_box{
		width: 100%;
		min-height: 700rpx;
		background: #fff;
	}
	.kuaidi_item:first-child{
		margin-top: 110rpx;
	}
	.kuaidi_item{
		width: 690rpx;
		height: 88rpx;
		margin: 0 auto;
		
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.kuaidi_itemL{
		margin-left: 20rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
	}
	.we_ui{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		text-align: right;
	}
	.placlass{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #DDDDDD;
		line-height: 45rpx;
	}
	.kuaidi_itemR{
		width: 530rpx;
		margin-right: 20rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		text-align: right;
	}
	.kuaidi_line{
		width: 690rpx;
		height: 2rpx;
		background: #EEEEEE;
		border-radius: 1rpx;
		margin: 0 auto;
	}
	.kuaidi_item1{
		width: 690rpx;
		min-height: 134rpx;
		margin: 0 auto;
		
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.kuaidi_itemL1{
		margin-left: 20rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		margin-bottom: 50rpx;
	}
	.uploadkuaidi_box{
		margin-top: 40rpx;
		margin-left: 52rpx;
		display: flex;
		align-items: center;
		
	}
	.uploadkuaidi{
		width: 93rpx;
		height: 93rpx;
		border: 1rpx solid #BBBBBB;
		border-radius: 10rpx;
		font-size: 20rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}
	.uploadkuaidi1{
	width: 92rpx;
	height: 92rpx;
	background: #EEEEEE;
	border-radius: 10rpx;
	margin-left: 20rpx;
		/* line-height: 45rpx; */
		position: relative;
	}
	.express_img{
		width: 100%;
		height: 100%;
	}
	.cameraicon{
		width: 32rpx;
		height: 29rpx;
		margin-bottom: 9rpx;
	}
	.upload_close{
		width: 19rpx;
		height: 19rpx;
		position: absolute;
		left: 4rpx;
		top: 4rpx;
	}
	.bottom_btn{
		width: 692rpx;
		height: 90rpx;
		background: #eee;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 39rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333;
		line-height: 90rpx;
		text-align: center;
	}
	.bottom_btn_active{
		background: #FFFFFF;
		border: 2rpx solid #EF0E6C;
		color: #EF0E6C;
	}
	.bottomsubmit{
		width: 690rpx;
		height: 88rpx;
		background: #EF0E6C;
		border-radius: 10rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 88rpx;
		margin: 0 auto;
		margin-top: 30rpx;
		margin-bottom: 20rpx;
		text-align: center;
	}
</style>